import { useState, createContext } from "react"
import SubNode from "./subNode"

//useCountext作用是优化使用context的时候后代码逻辑,让代码逻辑变得通俗简便

//创建countext

let ThemeCountext = createContext<{ color: string }>({ color: "red" })

let ThemeTitile = createContext<string>("React从入门到精通")

let UseContextCom = () => {
    return (
        <fieldset>
            <legend>useContext</legend>
            <ThemeCountext.Provider value={{ color: "green" }}>
                <ThemeTitile.Provider value="React从入门到精通">
                    <SubNode />
                </ThemeTitile.Provider>
            </ThemeCountext.Provider>
        </fieldset >
    )
}

export {
    //默认导出
    UseContextCom as default,
    //模块导出,引入的时候需要使用 import {xx} from "xxx"
    ThemeCountext,
    ThemeTitile
}